<!--
 * @Description: rtsp转websocket，前端jsmpeg,node,rtsp2web
 * @Author: xuzp4
 * @Date: 2021-11-17 10:25:01
 * @LastEditors: xuzp4
 * @LastEditTime: 2022-09-22 15:53:34
 * @FilePath: \vue_demo\src\view\video3\rtsp2ws.vue
-->
<template>
  <div>
    <canvas id="canvas" style="width: 600px; height: 600px"></canvas>
  </div>
</template>
<script>
export default {
  data() {
    return {
      rtsp: "rtsp://wowzaec2demo.streamlock.net/vod/mp4:BigBuckBunny_115k.mp4",
    };
  },
  mounted() {
    window.JSMpeg = JSMpeg
    var rtsp = this.rtsp;
    // 将rtsp视频流地址进行btoa处理一下
    new JSMpeg.Player("ws://localhost:9999/rtsp?url=" + btoa(rtsp), {
      canvas: document.getElementById("canvas"),
    });
  },
  beforeDestroy() {
    this.player.destory();
  },
};
</script>
<style>
.demo-video {
  max-width: 880px;
  max-height: 660px;
}
</style>